<template>
	<view class="" style="padding: 1rpx 30rpx 30rpx;" v-if="pageShow">
		<!-- 租买车 -->
		<view class="" style="padding-bottom: 140rpx;" v-if="type==1">
			<view class="ffffff radius mainpadding margin_top">
				<view class="flexbetween margin_top ">
					<image class="sptp" :src="dataAll.car_image_text" mode=""></image>
					<view class="flexcolumnbet" style="width: 77%;height: 124rpx;">
						<view class="ershiba xiaohei yhxk">{{dataAll.car_name}}</view>
						<view class="strongtext xiaohui">{{dataAll.difference}}</view>
						<view class="flexbetween " style="width: 100%;">
							<view class="titletext xiaohong fonweight">￥{{dataAll.pay_price}}</view>
							<view class="ershil xiaohui">x1</view>
						</view>
					</view>
				</view>
				<view class="flexleft margin_top">
					<view class="zhonghei fonweight ershil margin_right3">商品评价</view>
					<u-rate :count="5" v-model="star" active-color="#FAB536"></u-rate>
				</view>
				<textarea class="textarea margin_top" placeholder="请输入您的评价~" v-model="content"></textarea>
				<!-- 添加图片 -->
				<view class="flexleft flex_wrap ">
					<view class="flexcenter sanshis" v-for="(item,index) in images_text">
						<view class="shantp dingwei margin_right2 margin_top">
							<image :src="item" mode=""></image>
							<view class="shanchu" @click="delindex(index,images,images_text)"></view>
						</view>
					</view>
					<view class="flexcenter sanshis" v-if="images_text.length<3" @click="uploadImg(3,images,images_text)">
						<view class="huibox margin_top">
							<image src="../static/images/system/upimg.png" mode=""></image>
						</view>
					</view>
				</view>
			</view>
		</view>
		<!-- 住宿 -->
		<view class="" style="padding-bottom: 140rpx;" v-if="type==2">
			<view class="ffffff radius mainpadding margin_top">
				<view class="flexbetween margin_top ">
					<image class="sptp" :src="dataAll.hoteltype.image_text" mode=""></image>
					<view class="flexcolumnbet" style="width: 77%;height: 124rpx;">
						<view class="ershiba xiaohei yhxk">{{dataAll.hoteltype.name}}</view>
						<view class="flexbetween " style="width: 100%;">
							<view class="titletext xiaohong fonweight">{{dataAll.pay_price}}</view>
							<view class="ershil xiaohui">x1</view>
						</view>
					</view>
				</view>
				<view class="flexleft margin_top">
					<view class="zhonghei fonweight ershil margin_right3">商品评价</view>
					<u-rate :count="5" v-model="star" active-color="#FAB536"></u-rate>
				</view>
				<textarea class="textarea margin_top" placeholder="请输入您的评价~" v-model="content"></textarea>
				<!-- 添加图片 -->
				<view class="flexleft flex_wrap ">
					<view class="flexcenter sanshis" v-for="(item,index) in images_text">
						<view class="shantp dingwei margin_right2 margin_top">
							<image :src="item" mode=""></image>
							<view class="shanchu" @click="delindex(index,images,images_text)"></view>
						</view>
					</view>
					<view class="flexcenter sanshis" v-if="images_text.length<3" @click="uploadImg(3,images,images_text)">
						<view class="huibox margin_top">
							<image src="../static/images/system/upimg.png" mode=""></image>
						</view>
					</view>
				</view>
			</view>
		</view>
		<!-- 养护 -->
		<view class="" style="padding-bottom: 140rpx;" v-if="type==4">
			<view class="ffffff radius mainpadding margin_top">
				<view class="flexbetween margin_top ">
					<image class="sptp" :src="dataAll.carshop_goods_image_text" mode=""></image>
					<view class="flexcolumnbet" style="width: 77%;height: 124rpx;">
						<view class="ershiba xiaohei yhxk">{{dataAll.carshop_goods_name}}</view>
						<view class="flexbetween" style="width: 100%;">
							<view class="titletext xiaohong fonweight">¥{{dataAll.pay_price}}</view>
							<view class="ershil xiaocheng">x1</view>
						</view>
					</view>
				</view>
				<view class="flexleft margin_top">
					<view class="zhonghei fonweight ershil margin_right3">商品评价</view>
					<u-rate :count="5" v-model="star" active-color="#FAB536"></u-rate>
				</view>
				<textarea class="textarea margin_top" placeholder="请输入您的评价~" v-model="content"></textarea>
				<!-- 添加图片 -->
				<view class="flexleft flex_wrap ">
					<view class="flexcenter sanshis" v-for="(item,index) in images_text">
						<view class="shantp dingwei margin_right2 margin_top">
							<image :src="item" mode=""></image>
							<view class="shanchu" @click="delindex(index,images,images_text)"></view>
						</view>
					</view>
					<view class="flexcenter sanshis" v-if="images_text.length<3" @click="uploadImg(3,images,images_text)">
						<view class="huibox margin_top">
							<image src="../static/images/system/upimg.png" mode=""></image>
						</view>
					</view>
				</view>
			</view>
		</view>
		<!-- 餐饮 -->
		<view class="" style="padding-bottom: 140rpx;" v-if="type==3">
			<view class="ffffff radius mainpadding margin_top"  v-for="item in dataAll.goods" :key="item.id">
				<view class="flexbetween margin_top ">
					<image class="sptp" :src="item.image_text" mode=""></image>
					<view class="flexcolumnbet" style="width: 77%;height: 124rpx;">
						<view class="ershiba xiaohei yhxk">{{item.title}}</view>
						<view class="strongtext xiaohui">{{item.difference}}</view>
						<view class="flexbetween" style="width: 100%;">
							<view class="titletext xiaohong fonweight">{{item.price}}</view>
							<view class="ershil xiaocheng">x{{item.number}}</view>
						</view>
					</view>
				</view>
				<view class="flexleft margin_top">
					<view class="zhonghei fonweight ershil margin_right3">商品评价</view>
					<u-rate :count="5" v-model="item.star" active-color="#FAB536"></u-rate>
				</view>
				<textarea class="textarea margin_top" placeholder="请输入您的评价~" v-model="item.content"></textarea>
				<!-- 添加图片 -->
				<view class="flexleft flex_wrap ">
					<view class="flexcenter sanshis" v-for="(ite,index) in item.images_text">
						<view class="shantp dingwei margin_right2 margin_top">
							<image :src="ite" mode=""></image>
							<view class="shanchu" @click="delindex(index,item.images,item.images_text)"></view>
						</view>
					</view>
					<view class="flexcenter sanshis" v-if="item.images_text.length<3" @click="uploadImg(3,item.images,item.images_text)">
						<view class="huibox margin_top">
							<image src="../static/images/system/upimg.png" mode=""></image>
						</view>
					</view>
				</view>
			</view>
		</view>
		<view class="gudingdb mainpadding ffffff">
			<view class="bigbtn" @click="submit">立即发布</view>
		</view>
	</view>
</template>

<script>
	const httpRequest = require("@/common/httpRequest.js")
	export default {
		data() {
			return {
				type: 1, //1租买车，2住宿，3餐饮，4养护
				listid: "",
				star: 0,
				content: "",
				images: [],
				images_text: [],
				dataAll: {},
				pageShow: false,
			}
		},
		onLoad(options) {
			this.listid = options.id
			this.type = options.type
			this.getDetail()
		},
		methods: {
			submit(){
				if(this.type==3){
					this.cySubmit()
					return false
				}
				let url = "/api/carordercl/commentOrder"//租买车
				let data = {
					order_id:this.listid,
					star:this.star,
					content:this.content,
					images:this.images.join(),
				}
				let apiType = "POST"
				if(this.type==2){//住宿
					url = "/api/Hotelordercl/commentOrder"
					apiType = "GET"
					this.$set(data,"id",this.listid)
					delete data.order_id
				}
				if(this.type==4){//养护
					url = "/api/Carshopordercl/commentOrder"
				}
				if(this.star==""){
					httpRequest.toast("请先进行打分")
					return false
				}
				if(this.content==""){
					httpRequest.toast("请输入内容后提交")
					return false
				}
				httpRequest.request(url, apiType, data).then(res => {
					if(res.code==1){
						httpRequest.toast(res.msg)
						setTimeout(()=>{
							uni.navigateBack(1)
						},1000)
					}
				})
				
			},
			cySubmit(){
				let data = {
					order_id:this.listid,
					goodsdata:[]
				}
				for(let i=0;i<this.dataAll.goods.length;i++){
					let item = this.dataAll.goods[i]
					console.log(item.star);
					if(item.star==0){
						httpRequest.toast("请先对"+item.title+"进行打分")
						return false
					}
					if(item.content==""){
						httpRequest.toast("请对"+item.title+"做出评价")
						return false
					}
					data.goodsdata.push({
						foodshop_goods_id:item.goods_id,
						star:item.star,
						content:item.content,
						images:item.images.join(),
					})
				}
				httpRequest.request("/api/Foodshoporder/commentOrder", "POST", data).then(res => {
					if(res.code==1){
						httpRequest.toast(res.msg)
						setTimeout(()=>{
							uni.navigateBack(1)
						},1000)
					}
				})
			},
			getDetail() {
				let url = "/api/carordercl/getOrderInfo" //租买车
				if (this.type == 2) { //住宿
					url = "/api/Hotelordercl/detail"
				}
				if (this.type == 3) { //餐饮
					url = "/api/Foodshoporder/getOrderInfo"
				}
				if (this.type == 4) { //养护
					url = "/api/Carshopordercl/getOrderInfo"
				}
				httpRequest.request(url, 'GET', {
					id: this.listid,
				}).then(res => {
					if(this.type==3){
						res.data.goods.forEach(item=>{
							this.$set(item,"star",0)
							this.$set(item,"content","")
							this.$set(item,"images",[])
							this.$set(item,"images_text",[])
						})
					}
					this.dataAll = res.data
					this.pageShow = true
				})
			},
			uploadImg(value, upImgs, upImgs_text) { //上传图片
				let _this = this;
				let num = Number(value) - upImgs.length;
				if (num <= 0) {
					return false;
				}
				uni.showActionSheet({
					itemList: ['相机', '相册'],
					success: function(res) {
						// 选择相机走0
						if (res.tapIndex == 0) {
							httpRequest.chooseImage(num, ['camera']).then(res => {
								for (var i = 0; i < res.length; i++) {
									_this.uploadImageService(res[i], upImgs, upImgs_text)
								}
							}).catch(err => {});
						}
						// 选择相册走1
						if (res.tapIndex == 1) {
							httpRequest.chooseImage(num, ['album']).then(res => {
								for (var i = 0; i < res.length; i++) {
									_this.uploadImageService(res[i], upImgs, upImgs_text)
								}
							}).catch(err => {});
						}
					},
					fail: function(res) {}
				});
			},
			delindex(index, upImg, upImgs_text) {
				upImg.splice(index, 1)
				upImgs_text.splice(index, 1)
			},
			uploadImageService(url, upImg, upImgs_text) {
				let _this = this;
				httpRequest.uploadFile('/api/common/upload', url).then(res => {
					let image_item = res.fullurl;
					upImg.push(res.url)
					upImgs_text.push(image_item);
				}).catch(err => {});
			},
		}
	}
</script>

<style lang="scss" scoped>
	.huibox {
		width: 200rpx;
		height: 200rpx;

		image {
			width: 100%;
			height: 100%;
		}
	}

	.shantp {
		width: 200rpx;
		height: 200rpx;

		image {
			width: 100%;
			height: 100%;
		}
	}

	.shanchu {
		width: 32rpx;
		height: 32rpx;
		position: absolute;
		top: 0;
		right: 0;
		background-size: 100% 100%;
		background-image: url('@/static/images/system/shanchu.png');
	}

	.textarea {
		border-radius: 8rpx 8rpx 8rpx 8rpx;
		padding: 30rpx;
		box-sizing: border-box;
		width: 100%;
		height: 203rpx;
		border: 2rpx solid #EFEFEF;
	}

	.sptp {
		width: 124rpx;
		height: 124rpx;
		border-radius: 14rpx 14rpx 14rpx 14rpx;
	}
</style>